import React from 'react'
import './index.css'
import Modal from './Modal'

class Portal extends React.Component<{ name: string }, { showModal: boolean }> {
    state = { showModal: false }
    render() {
        const modal = this.state.showModal ? (
            <>
                <Modal>
                    <div className="modal">
                        <div>message</div>
                        <button onClick={() => this.setState({ showModal: false })}>Hide modal</button>
                    </div>
                </Modal>
            </>
        ) : null;

        return (
            <div className="app">
                This div has overflow: hidden.
                <button onClick={() => this.setState({ showModal: true })}>Show modal</button>
                {modal}
            </div>
        );
    }
}

export default Portal;
